function $(obj){
	return document.getElementById(obj);
}
$('smallBox').onmouseover=function(){
	$('mask').style.display='block';
	$('bigBox').style.display='block';
}
$('smallBox').onmouseleave=function(){
	$('mask').style.display='none';
	$('bigBox').style.display='none';
}
$('smallBox').onmousemove=function(){
	var pageX=event.pageX;
	var pageY=event.pageY;
	var maskX=pageX-$('mask').offsetWidth/2;
	var maskY=pageY-$('mask').offsetHeight/2;
	if(maskX<0){
		maskX=0;
	}
	if(maskY<0){
		maskY=0;
	}
	if(maskX>$('box').offsetWidth-$('mask').offsetWidth){
		maskX=$('box').offsetWidth-$('mask').offsetWidth;
	}
	if(maskY>$('box').offsetHeight-$('mask').offsetHeight){
		maskY=$('box').offsetHeight-$('mask').offsetHeight;
	}
	$('mask').style.left=maskX+'px';
	$('mask').style.top=maskY+'px';
	var bigImgToMove=$('bigImg').offsetWidth-$('bigBox').offsetWidth;
	var maskToMove=$('smallBox').offsetWidth-$('mask').offsetWidth;
	var rate=bigImgToMove/maskToMove;
	$('bigImg').style.left=-rate*maskX+'px';
	$('bigImg').style.top=-rate*maskY+'px';
}

